<template>
  <div class="main">
    <div class="yy-header">
      <div class="yy-container">
        <div class="logo fl">
          <img :src="companyLogo">
        </div>
      </div>
    </div>
    <div class="down-app" :style="'background-image:url('+ bgApp +');background-color: rgb(75, 81, 84);'">
      <div class="yy-container mt40 clearfix">
        <div class="app-desc fl">
          <h2 class="f36">打开问易得，每天成长，成就自己</h2>
          <p class="f22 mt40">问易得法律咨询与各专业领域资深律师合作；致力于为广大用户提供优质的在线法律咨询及企业管理咨询服务【线下服务可同时提供】；您问得容易，我答的快速；方便快捷！</p>
          <div class="mt40 clearfix" />
        </div>
        <div class="mt40 fr">
          <img style="width: 300px;" src="../../../assets/images/app.png" alt="">
        </div>
      </div>
    </div>
    <div class="yy-footer">
      <div class="yy-container">
        <div class="footer-items clearfix">
          <div class="footer-menu">
            <dl class="phone">
              <p>24小时在线客服</p>
              <p class="phone-number">13349092002</p>
            </dl>
            <dl class="information">
              <p>公司邮箱：support@wenyide.com</p>
              <p>公司地址：安徽省合肥市包河区徽州大道5006号滨湖世纪城琼林苑C座1402室</p>
            </dl>
          </div>
        </div>
        <p class="beian">© 2017-2022 合肥问易得企业管理咨询有限公司 All Rights Reserved. <a v-if="false" style="color: rgb(206, 206, 206); --darkreader-inline-color:#c9c4bd;" href="//beian.miit.gov.cn/" target="_blank" data-darkreader-inline-color="">沪ICP备17017491号-1</a></p>
      </div>
    </div>
  </div>
</template>

<script>
import BgApp from '@/assets/images/bg_app.png'
import CompanyLogo from '@/assets/images/company-logo.png'
import { mapGetters } from 'vuex'
import { getToken } from '@/utils/auth'
export default {
  name: 'AppIntro',
  data: () => {
    return {
      bgApp: BgApp,
      companyLogo: CompanyLogo
    }
  },
  computed: {
    ...mapGetters([
      'user'
    ]),
    isLogin() {
      return getToken()
    },
    content() {
      return this.isLogin && this.article && this.article.content && this.article.content.length > 0 ? this.article.content.replace(/<img[^>]*>/gi, function(match, capture) {
        return match.replace(/style\s*?=\s*?([‘"])[\s\S]*?\1/gi, '').replace('<img ', '<img style="max-width:100%;height:auto;" ') // 替换style
      }) : null
    },
    summary() {
      return this.article && this.article.summary && this.article.summary.length > 0 ? this.article.summary : null
    }
  },
  mounted() {

  },
  methods: {
    login() {
      this.$router.push(`/phone-login?redirect=${this.$route.fullPath}`) // 否则全部重定向到登录页
    },
    openAPP() {

    }
  }
}
</script>

<style lang="scss" scoped>
.down-app {
  background-size: cover;
    background-color: #636363;
    width: 100%;
    height: 682px;
    overflow: hidden;
    background-repeat: no-repeat;
}
.yy-header {
    height: 78px;
    width: 100%;
    top: 0;
    z-index: 88888;
    -webkit-box-shadow: 0 2px 7px 0 rgb(153 153 153 / 40%);
    background-image: initial;
    background-color: rgb(24, 26, 27);
    box-shadow: rgb(82 88 92 / 40%) 0px 2px 7px 0px;
}
.yy-container {
    width: 1200px;
    margin: 0 auto;
}
.fl {
    float: left!important;
}
.yy-header .logo img {
    height: 78px;
}
.mt40 {
    margin-top: 40px!important;
}
.down-app .app-desc {
  width: 700px;
    color: rgb(232, 230, 227);
}
.fr {
    float: right!important;
}
.f36 {
    font-size: 36px;
}
.f22 {
    font-size: 22px;
}
.yy-footer {
  overflow: hidden;
  width: 100%;
  height: 366px;
  color: #cecece;
  background: #323232;
}
.yy-footer .footer-items {
  padding: 40px 0;
}
</style>
